<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <link href="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/css/bootstrap.css" rel="stylesheet" media="screen">
<div id="myCarousel" class="carousel slide">                        <!--设置轮播器区域样式，设置轮播器滚动样式-->
    <ol class="carousel-indicators">                                <!--设置轮播器列表区域样式，就是小圆点区域样式-->
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>    <!--设置当前列表首选-->
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>
    <div class="carousel-inner">                                    <!--设置轮播器图片区域-->
        <div class="item active">                                <!--设置轮播器图片样式-->
            <a href="#"><img src="http://p.ssl.qhimg.com/t013ae603a38c6a6388.jpg"/></a>
        </div>
        <div class="item">
            <a href="#"><img src="http://p.ssl.qhimg.com/t01beaea84908e3a3ec.jpg"/></a>
        </div>
        <div class="item">
            <a href="#"><img src="http://p.ssl.qhimg.com/t0188cc7af3128463d6.jpg"/></a>
        </div>
    </div>
    <!--设置轮播器箭头区域-->
    <a href="#myCarousel" data-slide="prev" class="carousel-control left">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>
    <a href="#myCarousel" data-slide="next" class="carousel-control right">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>
</div>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/js/bootstrap.js"></script>

